<template>
  <!-- 白键按钮 -->
  <button class="button-components">
    <i :class="buttonData.buttonDataSubscribed[0]"></i>
    <span>{{ buttonData.buttonDataSubscribed[1] }}</span>
  </button>
</template>

<script setup>
// 接收传递的值
const buttonData = defineProps(["buttonDataSubscribed"]);
</script>
<style lang='less'>
@import url(../../assets/fonts/tab/iconfont.css);
@import url(../../assets/fonts/song-list/iconfont.css);

.button-components {
  display: flex;
  background-color: white;
  border: 1px solid #00000021;
  border-radius: 16px;
  padding: 0 10px;
  height: 32px;
  line-height: 32px;
  font-size: 14px;
  color: #000000b2;
  transition: all .2s;

  &:hover{
    background-color: #f2f2f2;
  }

  span{
    margin-left: 3px;
  }
}
</style>